<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>设计小帮手</title>
    <link rel="stylesheet" href="styles.css">
    <link rel="stylesheet" href="review-results.css">
</head>
<body>
    <div class="dashboard">
        <!-- 左侧导航栏 -->
        <div class="sidebar">
            <div class="app-title">
                <i class="material-icons">design_services</i>
                <span>设计小帮手</span>
            </div>
            
            <div class="create-button" id="homeButton">
                工作台
            </div>
            
            <div class="sidebar-section">
                <div class="sidebar-title">功能选择</div>
                <ul class="feature-list">
                    <li class="category-item">
                        <div class="category-name">
                            <span><i class="material-icons">folder</i> 文档审核</span>
                            <i class="material-icons category-toggle">chevron_right</i>
                        </div>
                        <ul class="submenu">
                            <li class="submenu-item" data-feature="excel">
                                <label>
                                    <input type="radio" class="feature-radio" name="fileType" value="excel">
                                    <span class="submenu-icon"><i class="material-icons">table_chart</i></span>
                                    <span>文档审核项生成</span>
                                </label>
                            </li>
                            <li class="submenu-item" data-feature="review">
                                <label>
                                    <input type="radio" class="feature-radio" name="fileType" value="review">
                                    <span class="submenu-icon"><i class="material-icons">fact_check</i></span>
                                    <span>文档AI审核</span>
                                </label>
                            </li>
                            <li class="submenu-item" data-feature="doccheck">
                                <label>
                                    <input type="radio" class="feature-radio" name="fileType" value="doccheck">
                                    <span class="submenu-icon"><i class="material-icons">description</i></span>
                                    <span>文档完整性检查概览</span>
                                </label>
                            </li>
                        </ul>
                    </li>
                    <li class="category-item">
                        <div class="category-name">
                            <span><i class="material-icons">code</i> 代码审核</span>
                            <i class="material-icons category-toggle">chevron_right</i>
                        </div>
                        <ul class="submenu">
                            <li class="submenu-item" data-feature="codeReview">
                                <label>
                                    <input type="radio" class="feature-radio" name="fileType" value="code_audit_gen">
                                    <span class="submenu-icon"><i class="material-icons">assignment</i></span>
                                    <span>代码审核项生成</span>
                                </label>
                            </li>
                            <li class="submenu-item" data-feature="codeAudit">
                                <label>
                                    <input type="radio" class="feature-radio" name="fileType" value="code_audit">
                                    <span class="submenu-icon"><i class="material-icons">security</i></span>
                                    <span>代码AI审核</span>
                                </label>
                            </li>
                            <li class="submenu-item">
                                <label>
                                    <input type="radio" class="feature-radio" name="fileType" value="doc_to_code">
                                    <span class="submenu-icon"><i class="material-icons">description</i></span>
                                    <span>文档生成代码</span>
                                </label>
                            </li>
                            <li class="submenu-item">
                                <label>
                                    <input type="radio" class="feature-radio" name="fileType" value="code_to_doc">
                                    <span class="submenu-icon"><i class="material-icons">subject</i></span>
                                    <span>代码补全文档</span>
                                </label>
                            </li>
                        </ul>
                    </li>
                    <li class="category-item">
                        <div class="category-name">
                            <span><i class="material-icons">build</i> 小工具</span>
                            <i class="material-icons category-toggle">chevron_right</i>
                        </div>
                        <ul class="submenu">
                            <li class="submenu-item">
                                <label>
                                    <input type="radio" class="feature-radio" name="fileType" value="word">
                                    <span class="submenu-icon"><i class="material-icons">article</i></span>
                                    <span>文档生成Markdown</span>
                                </label>
                            </li>
                            <li class="submenu-item" onclick="window.location.href='template-apply'">
                                <span class="submenu-icon"><i class="material-icons">content_copy</i></span>
                                <span>文档模板套用</span>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
            
            <div class="sidebar-section">
                <div class="sidebar-title">Power By</div>
                <div style="font-size: 14px; opacity: 0.8;">技术管理团队</div>
            </div>
        </div>
        
        <!-- 主内容区域 -->
        <div class="main-content">
            <!-- 面包屑导航 -->
            <div class="breadcrumb">
                <span class="breadcrumb-item">工作台</span>
            </div>
            <!-- 统计卡片 -->
            <div class="stats-container">
                <div class="stat-card">
                    <div class="stat-icon" style="background-color: #6f42c1;">
                        <i class="material-icons">article</i>
                    </div>
                    <div class="stat-info">
                        <div class="stat-value">0</div>
                        <div class="stat-label">已处理文档</div>
                    </div>
                </div>
                <div class="stat-card">
                    <div class="stat-icon" style="background-color: #20c997;">
                        <i class="material-icons">table_chart</i>
                    </div>
                    <div class="stat-info">
                        <div class="stat-value">0</div>
                        <div class="stat-label">已生成Prompt</div>
                    </div>
                </div>
                <div class="stat-card">
                    <div class="stat-icon" style="background-color: #fd7e14;">
                        <i class="material-icons">fact_check</i>
                    </div>
                    <div class="stat-info">
                        <div class="stat-value">0</div>
                        <div class="stat-label">已审核文档</div>
                    </div>
                </div>
                <div class="stat-card">
                    <div class="stat-icon" style="background-color: #adb5bd;">
                        <i class="material-icons">task_alt</i>
                    </div>
                    <div class="stat-info">
                        <div class="stat-value">0</div>
                        <div class="stat-label">今日审核数</div>
                    </div>
                </div>
            </div>
            
            <!-- 工作台功能区域 -->
            <div id="workspaceContainer" class="workspace-container">
                <!-- 第一行：我的任务、公告和功能导航 -->
                <div class="workspace-row">
                    <!-- 我的任务卡片 - 宽度缩小到1/3 -->
                    <div class="workspace-card my-tasks" style="flex: 1;">
                        <h3>我的任务</h3>
                        <div class="task-list">
                            <div class="task-item">
                                <div class="task-status pending"></div>
                                <div class="task-content">
                                    <div class="task-title">待进行0321托管设计文档审核</div>
                                    <div class="task-date">截止日期: 2025-03-21</div>
                                </div>
                            </div>
                            <div class="task-item">
                                <div class="task-status in-progress"></div>
                                <div class="task-content">
                                    <div class="task-title">完成0321员工渠道设计文档审核</div>
                                    <div class="task-date">截止日期: 2025-03-21</div>
                                </div>
                            </div>
                            <div class="task-item">
                                <div class="task-status completed"></div>
                                <div class="task-content">
                                    <div class="task-title">待进行设计文档套模板工作</div>
                                    <div class="task-date">完成日期: 2025-03-21</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <!-- 公告卡片 -->
                    <div class="workspace-card announcements" style="flex: 1;">
                        <h3>公告</h3>
                        <div class="announcement-list">
                            <div class="announcement-item">
                                <div class="announcement-title"><a href="javascript:void(0)" onclick="window.open('audit-manual.html', '文档AI审核功能使用手册', 'width=1000,height=800,resizable=yes,scrollbars=yes')">文档AI审核功能使用手册</a></div>
                                <div class="announcement-content">详细介绍了文档AI审核功能的使用方法和注意事项，点击查看完整手册。</div>
                                <div class="announcement-meta">2025-03-24</div>
                            </div>
                            <div class="announcement-item">
                                <div class="announcement-title">新功能发布</div>
                                <div class="announcement-content">文档AI审核功能现已上线，欢迎试用并提供反馈。</div>
                                <div class="announcement-meta">2025-03-19</div>
                            </div>
                        </div>
                    </div>
                    
                    <!-- 功能导航卡片 -->
                    <div class="workspace-card common-features" style="flex: 1;">
                        <h3>功能导航</h3>
                        <div class="feature-flow">
                            <div class="feature-icon" onclick="showFeatureDescription('excel')">
                                <i class="material-icons">table_chart</i>
                                <span>文档审核项生成</span>
                            </div>
                            <div class="feature-arrow">
                                <i class="material-icons">arrow_forward</i>
                            </div>
                            <div class="feature-icon" onclick="showFeatureDescription('review')">
                                <i class="material-icons">fact_check</i>
                                <span>文档AI审核</span>
                            </div>
                        </div>
                        <div class="feature-flow-description">
                            可先将自定义审核项文档转化为提示词，再按照提示词进行AI审核
                        </div>
                    </div>
                </div>
                
                <!-- 第二行：设计文档质量看板 -->
                <div class="workspace-row">
                    <div class="workspace-card quality-dashboard">
                        <h3>设计文档质量看板</h3>
                        <div class="quality-stats">
                            <div class="quality-stat-item">
                                <div class="quality-value">85%</div>
                                <div class="quality-label">规范符合率</div>
                            </div>
                            <div class="quality-stat-item">
                                <div class="quality-value">12</div>
                                <div class="quality-label">待审核文档</div>
                            </div>
                            <div class="quality-stat-item">
                                <div class="quality-value">24</div>
                                <div class="quality-label">本月已审核</div>
                            </div>
                            <div class="quality-stat-item">
                                <div class="quality-value">92%</div>
                                <div class="quality-label">审核通过率</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 功能说明区域 -->
            <div id="featureDescription" class="feature-description" style="display: none;">
                <p id="featureText"></p>
            </div>
            
            <!-- 普通上传区域 -->
            <div id="uploadArea" class="upload-area" style="display: none;">
                <p id="uploadText">拖拽文件到这里或点击选择文件</p>
                <input type="file" id="fileInput" accept=".docx,.xlsx" style="display: none">
                <button class="btn" onclick="document.getElementById('fileInput').click()">选择文件</button>
                <div id="templateDownloadBtn" style="display: none; margin-top: 15px;">
                    <a href="/download-audit-template" class="btn download-btn" style="text-decoration: none;">下载Excel模板</a>
                </div>
            </div>
            
            <!-- 审核模式双栏上传区域 -->
            <div id="twoColumnUpload" class="two-column-upload" style="display: none;">
                <div class="upload-column">
                    <p>Word文档</p>
                    <p id="wordFileName" style="margin: 8px 0; min-height: 20px;">未选择</p>
                    <input type="file" id="wordFileInput" accept=".docx" style="display: none">
                    <button id="uploadWordBtn" class="btn" onclick="document.getElementById('wordFileInput').click()">上传Word文档</button>
                </div>
                <div class="upload-column">
                    <!-- 添加审核模式选择下拉框，移动到Excel上传区域上方 -->
                    <div class="review-mode-selector" style="width: 100%; margin-bottom: 20px;">
                        <p>审核模式选择:</p>
                        <select id="reviewModeSelect" class="model-select" style="width: 100%;">
                            <option value="baseAudit" selected>基础审核项（宽松）</option>
                            <option value="sdAudit">实调审核项（严格）</option>
                            <option value="customAudit">上传审核项（专业）</option>
                        </select>
                    </div>
                    <p>Excel文档</p>
                    <p id="excelFileName" style="margin: 8px 0; min-height: 20px;">未选择</p>
                    <input type="file" id="excelFileInput" accept=".xlsx" style="display: none">
                    <button id="uploadExcelBtn" class="btn" onclick="document.getElementById('excelFileInput').click()">上传Excel文档</button>
                    <div style="margin-top: 10px;">
                        <a href="/download-audit-template-with-prompt" class="btn download-btn" style="text-decoration: none;">下载Excel模板</a>
                    </div>
                </div>
            </div>
            
            <!-- 模型选择器 -->
            <div id="modelSelector" class="model-selector" style="display: none;">
                <p>选择模型类型:</p>
                <select id="modelType" class="model-select">
                    <option value="DeepSeek-R1-671B_20250302">大模型类型：建行方舟满血版R1（高质量）</option>
                    <option value="DeepSeek-R1-QW32B_SFT_0228_V1">大模型类型：建行方舟蒸馏版（高响应）</option>
                    <option value="deepseek-reasoner">大模型类型：公网Deepseek R1</option>
                </select>
            </div>
            
            <!-- 进度条 -->
            <div id="progressContainer" class="progress-container">
                <div class="progress-bar-container">
                    <div id="progressBar" class="progress-bar"></div>
                </div>
                <div id="progressText" class="progress-text">已完成: 0%</div>
                
                <!-- 日志显示区域 -->
                <div id="logContainer" class="log-container">
                    <div class="log-header">审核任务实时日志</div>
                    <pre id="logArea" class="log-area">等待日志信息...</pre>
                </div>
            </div>

            <div id="loading" class="loading">正在处理中...</div>
            <div id="error" class="error"></div>
            <div id="success" class="success"></div>
            
            <div class="actions">
                <button id="process-excel-btn" class="btn process-btn" style="display: none;">生成Prompt</button>
                <button id="process-review-btn" class="btn process-btn" style="display: none;">开始审核检查</button>
                <button id="download-word-btn" class="btn download-btn" style="display: none;">下载Markdown文件</button>
                <button id="download-excel-btn" class="btn download-btn" style="display: none;">下载Excel文件</button>
            </div>
            
            <div id="preview"></div>
        </div>
    </div>

    <!-- 引用外部JS文件 -->
    <script src="main.js"></script>
</body>
</html>
